<template>
  <div id="operate" style="position: fixed; margin-top: -35px">
    <el-row justify="space-between" style="height: 60px;width: calc(100% - 24px); margin: 0 12px;">
      <el-col :span="7">
        <div class="grid-content">
          <img :src="logo0221" style="height: 40px;margin-top:10px;"/>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="grid-content" >
          <el-select class="custom-select" v-model="value" size="large" placeholder="请输入客户名称" style="width: 100%;height: 50px;margin-top:10px;">
            <el-option
              v-for="item in cities"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
              <span style="float: left">{{ item }}</span>

              <el-button style="float: right;color: #eb5f25;"

                text
              >
                详细资料
              </el-button>
              <el-button style="float: right;color: #eb5f25;"
                         type="danger"
                         text
              >
                能效云
              </el-button>
            </el-option>
          </el-select>
        </div>
      </el-col>
      <el-col :span="7"><div class="grid-content ep-bg-purple"></div></el-col>
    </el-row>
  </div>
</template>

<script setup name="Soperate" lang="ts">
import logo0221 from '@/assets/imgs/screen/operate/0221.png';
const value = ref('');
const cities = ref([1]);


</script>

<style scoped lang="scss">
#operate {
  position: relative;
  justify-content: center;
  /*align-items: center;*/
  height: 100vh;
  width: 100vw;
  background-color: #000;
  /*background-image: url("../../assets/imgs/screen/expand_bg.jpg");*/
  background-size: 100vw 100vh;
}
.grid-content{
  width: 100%;
  height: 100%;
}
.ep-bg-purple-light{
  background-color: #cccc50;
}
.ep-bg-purple{
  background-color: #5454c4;
}
::v-deep(.el-select) {
  --el-select-input-focus-border-color: #eb5f25;
}
.custom-select .el-select__wrapper {
  transition: all 0.3s ease;
  background-color: white;
}
.custom-select .el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px #eb5f25 inset !important;
  border-color: #eb5f25 !important;
}

</style>
